{echo:JS::import('form')}
{set:$items=array("填写账户信息","验证身份","设置新密码","完成");}
{widget:name=sub_navs action=crumbs items=$items step=4 current=1}
<div class="simple-box " style="width:600px;margin:40px auto;" >
	<form action="{url:/simple/forget_act}" method="post" >
		<ul class="form">
			<li><span class="perfix fa">&#xf007;</span><input class="input"  name="account" id="account"  pattern="required" placeholder="邮箱/手机号码"> <label>邮箱/手机号码</label></li>
			<li><span class="perfix fa">&#xf02a;</span><input type="text" class="input-sm" name="verifyCode" id="verifyCode"  pattern="\w{4}" maxlength="4" style="width: 80px;" placeholder="验证码"><label style="display:none"></label><img id="captcha_img"  src="{url:/simple/captcha/h/40/w/120}"><label><a href="javascript:void(0)" class="red" onclick="document.getElementById('captcha_img').src='{url:/simple/captcha/h/40/w/120/random/}'+Math.random()">换一张</a></label></li>
			<li><input type="submit" class="btn btn-main" value="找回密码"></li>
		</ul>
	</form>
</div>
<script type="text/javascript">

	$("input[pattern]").on("blur",function(event){
		var current_input = $(this);
		var result = autoValidate.validate(event);
		if(result){
			current_input.parent().removeClass('invalid').addClass('valid');
		}else{
			current_input.parent().removeClass('valid').addClass('invalid');
		}
	});
	$("input[name='account']").on("blur",function(event){
		var current_input = $(this);
		if(autoValidate.validate(event)){
			$.post("{url:/ajax/account/account/}"+$(this).val(),function(data){
				var msg = '此账户不存在!';
				if(!data['status']){
					msg = '账户合法!';
					current_input.next().show();
					current_input.parent().removeClass('invalid').addClass('valid');
				}else{
					current_input.parent().removeClass('valid').addClass('invalid');
				}
				autoValidate.showMsg({id:document.getElementById('account'),error:data['status'],msg:msg});
			},'json');
		}
	});
	$("input[name='verifyCode']").on("blur",function(){
		var current_input = $(this);
		$.post("{url:/ajax/verifyCode/verifyCode/}"+$(this).val(),function(data){
			if(data['status']){
				current_input.parent().removeClass('invalid').addClass('valid');
			}else{
				current_input.parent().removeClass('valid').addClass('invalid');
			}
			autoValidate.showMsg({id:document.getElementById('verifyCode'),error:!data['status'],msg:data['msg']});
		},'json');
	})
	{if:isset($invalid)}
	var form = new Form();
	form.setValue('account', '{$account}');
	autoValidate.showMsg({id:$("input[name='{$invalid['field']}']").get(0),error:true,msg:"{$invalid['msg']}"});
	{/if}

</script>
